  {%set templatePath = 'cms'|@template('path')%}
  {% extends "../cms/"+templatePath+"/inc_base.html" %} 
  {%block body%}class="header-scroll-reveal"{%endblock%} 
  {% block middle %}
  <!-- -->
  <div class="container py-4">

    <div class="row g-4">
      <!-- sidebar -->
      {% include "./inc_sidebar.html" %}
      <!-- content -->
      <div class="col-12 col-lg-10">

        <!-- Activity -->
        <div class="card mb-4">
          <div class="card-body p-4">

            <div class="mb-4">
              <h2 class="h5 mb-0">我的动态</h2>
              <small class="fw-bold"></small>
            </div>

            <div class="row">
              
              <div class="col-12 mb-4 border-top border-light d-lg-none"><!-- mobile separator --></div>

              <div class="col-lg-4">

                <div class="d-flex align-items-center">

                  <span class="flex-none">
                    <svg class="text-gray-600" width="58px" height="58px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
                      <path fill-rule="evenodd" d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"></path>
                      <path fill-rule="evenodd" d="M9.5 1h-3a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3zm4.354 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0z"></path>
                    </svg>
                  </span>

                  <div class="w-100 ps-3">
                    <strong class="d-block">2 订单</strong>
                    <a href="account-orders.html" class="text-decoration-none small">查看订单</a>
                  </div>

                </div>

              </div>

              <div class="col-12 my-4 border-top border-light d-lg-none"><!-- mobile separator --></div>

              <div class="col-lg-4">

                <div class="d-flex align-items-center">

                  <span class="flex-none">
                    <svg class="text-gray-600" width="58px" height="58px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
                      <path fill-rule="evenodd" d="M8 2.748l-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z"></path>
                    </svg>
                  </span>

                  <div class="w-100 ps-3">
                    <strong class="d-block">1 收藏</strong>
                    <a href="account-favourites.html" class="text-decoration-none small">查看收藏</a>
                  </div>

                </div>

              </div>

              <div class="col-12 my-4 border-top border-light d-lg-none"><!-- mobile separator --></div>

              <div class="col-lg-4">

                <div class="d-flex align-items-center">

                  <span class="flex-none">
                    <svg class="text-gray-600" width="58px" height="58px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
                      <path d="M3 2h8a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2h1a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1H1a2 2 0 0 1 2-2z"></path>
                      <path d="M5 0h8a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2v-1a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1H3a2 2 0 0 1 2-2zM1 6v-.5a.5.5 0 0 1 1 0V6h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V9h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z"></path>
                    </svg>
                  </span>

                  <div class="w-100 ps-3">
                    <strong class="d-block">1 评论</strong>
                    <a href="account-reviews.html" class="text-decoration-none small">查看评论</a>
                  </div>

                </div>
              
              </div>

            </div>

          </div>
        </div>


        <!-- Widgets -->
        <div class="row mb-4">

          <div class="col-md-4">

            <a href="/account/reward-list/" class="link-normal d-flex align-items-center bg-gray-200 px-3 py-4 rounded">
              <span class="text-muted">
                <svg width="50" height="50" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
                  <path fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"></path>
                  <path fill-rule="evenodd" d="M11.315 10.014a.5.5 0 0 1 .548.736A4.498 4.498 0 0 1 7.965 13a4.498 4.498 0 0 1-3.898-2.25.5.5 0 0 1 .548-.736h.005l.017.005.067.015.252.055c.215.046.515.108.857.169.693.124 1.522.242 2.152.242.63 0 1.46-.118 2.152-.242a26.58 26.58 0 0 0 1.109-.224l.067-.015.017-.004.005-.002zM4.756 4.566c.763-1.424 4.02-.12.952 3.434-4.496-1.596-2.35-4.298-.952-3.434zm6.488 0c1.398-.864 3.544 1.838-.952 3.434-3.067-3.554.19-4.858.952-3.434z"></path>
                </svg>
              </span>
              <div class="ps-3">
                <h5 class="mb-0">积分记录</h5>
                <p class="mb-0 small text-muted">您的积分记录</p>
              </div>
            </a>

          </div>

          <div class="col-md-4">

            <a href="account-reward.html" class="link-normal d-flex align-items-center bg-gray-200 px-3 py-4 rounded">
              <span class="text-muted">
                <svg width="50" height="50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                  <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
                  <circle cx="12" cy="10" r="3"></circle>
                </svg>
              </span>
              <div class="ps-3">
                <h5 class="mb-0">收货地址</h5>
                <p class="mb-0 small text-muted">您的收货地址</p>
              </div>
            </a>

          </div>

          <div class="col-md-4">

            <a href="/account/settings/" class="link-normal d-flex align-items-center bg-gray-200 px-3 py-4 rounded">
              <span class="text-muted">
              <svg width="50" height="50" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
                <path fill-rule="evenodd" d="M.102 2.223A3.004 3.004 0 0 0 3.78 5.897l6.341 6.252A3.003 3.003 0 0 0 13 16a3 3 0 1 0-.851-5.878L5.897 3.781A3.004 3.004 0 0 0 2.223.1l2.141 2.142L4 4l-1.757.364L.102 2.223zm13.37 9.019L13 11l-.471.242-.529.026-.287.445-.445.287-.026.529L11 13l.242.471.026.529.445.287.287.445.529.026L13 15l.471-.242.529-.026.287-.445.445-.287.026-.529L15 13l-.242-.471-.026-.529-.445-.287-.287-.445-.529-.026z"></path>
              </svg>
              </span>
              <div class="ps-3">
                <h5 class="mb-0">会员设置</h5>
                <p class="mb-0 small text-muted">编辑 账户 密码 邮箱</p>
              </div>
            </a>

          </div>

        </div>
  <!-- Feedback -->
  <div class="card mb-4">
    <div class="card-body p-4">

      <form method="post" action="#">

        <h2 class="h4 mb-4">
          给 <strong class="text-primary">{{ctx.app.config.sys.name}}</strong> 建议/留言
        </h2>

        <p class="small mb-4">
          你会把我们推荐给你的朋友和家人吗？0表示“我不推荐”，10表示“我很乐意推荐”。
        </p>

        <div id="rate-overall" class="clearfix mb-3">

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="0" id="rate-0">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-0">0</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="1" id="rate-1">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-1">1</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="2" id="rate-2">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-2">2</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="3" id="rate-3">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-3">3</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="4" id="rate-4">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-4">4</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="5" id="rate-5">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-5">5</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="6" id="rate-6">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-6">6</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="7" id="rate-7">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-7">7</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="8" id="rate-8">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-8">8</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="9" id="rate-9">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-9">9</label>
          </div>

          <div class="rate-item float-start d-inline-flex me-1 mb-1">
            <input required class="d-none-cloaked form-check-input form-check-input-primary" name="feedback_rate" type="radio" value="10" id="rate-10">
            <label class="form-check-label cursor-pointer px-3 py-2 bg-gray-200 rounded-sm fw-bold small" for="rate-10">10</label>
          </div>

        </div>

        <script>/* radio : checked background */
          let nodes = document.querySelectorAll('#rate-overall .rate-item');
          nodes.forEach(function(el) {

            el.querySelector('input').addEventListener('click', function(e) {
              
              nodes.forEach(function(item) {

                item.querySelector('label').classList.remove('bg-warning-soft');
                item.querySelector('label').classList.add('bg-gray-200');
              
              });

              el.querySelector('label').classList.remove('bg-gray-200');
              el.querySelector('label').classList.add('bg-warning-soft');

            });
          });
        </script>

        <textarea class="form-control my-3" rows="3" name="feedback_body" placeholder="请留下您的宝贵意见！"></textarea>

        <button type="submit" class="btn btn-sm btn-primary d-flex align-items-center">
          <svg class="float-start" width="18px" height="18px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
            <path fill-rule="evenodd" d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"></path>
          </svg>
          <span>提交</span>
        </button>

      </form>

    </div>
  </div>

      </div>

    </div>

  </div>
  <!-- / -->
  {% endblock %} 
  {%block script%}
  
  {%endblock%}
  